<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Sumador usando Ajax</title>
  </head>

  <body>
    <h1>Prueba AJAX</h1>

<div id="formulario"><p>Crea contador: <input type="text" name="contador" id="crea_cont" size="10"><button onclick='crearContador()'>Crea</button></p></div>
<div id="formulario"><p>Incrementar contador: <input type="text" name="contador" id="inc_cont" size="10"><button onclick='incrementa()'>Incrementa</button></p>

</div>
<script type="application/javascript">
function crearContador(){
  var request = new XMLHttpRequest();
  request.open('POST', '/contador/crea/'+document.getElementById('crea_cont').value , true);
  request.onreadystatechange=resultado ;
  request.send(null);
}

function incrementa(){
  var request = new XMLHttpRequest();
  request.open('GET', '/contador/'+document.getElementById('inc_cont').value , true);
  request.onreadystatechange=resultado ;
  request.send(null);
}

function resultado(){
  if ( request.readyState == 4 ) {
    if ( request.status == 200 ) {
        alert(request.responseText);
    }
  }
}
</script>
</body></html>
